<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!-- 引入 Bootstrap -->
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
<script src="http://cdn.static.runoob.com/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="http://cdn.static.runoob.com/libs/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<title>权限列表</title>
<style>
#myInput {
	background-image: url('https://static.runoob.com/images/mix/searchicon.png'); /* 搜索按钮 */
	background-position: 10px 12px; /* 定位搜索按钮 */
	background-repeat: no-repeat; /* 不重复图片*/
	width: 50%;
	font-size: 16px; /* 加大字体 */
	padding: 12px 20px 12px 40px;
	border: 1px solid #ddd;
	margin-bottom: 12px;
	display:inline;
}
#header {
	border-bottom:#000 medium dashed;
}
#container {
}
.item {
	border-bottom:#000 thin dotted;
}
</style>
</head>

<body>
<div id="header">
  <input type="text" id="myInput" onkeyup="myFunction()" style="margin-left:20px" placeholder="搜索...">
  <span>
  <input type="button" value="搜索" class="btn btn-default" style="margin-left:40px"/>
  </span> <span>
  <input type="button" value="添加权限" class="btn btn-default" onclick="addRight()" style="margin-left:40px"/>
  </span> </div>
<div id="container">
  <div class="item">
    <div><span style="margin-left:20px">权限一</span> <span>
      <button id="modify" style="margin-left:40px" class="btn btn-default"  data-toggle="collapse" 
    data-target="#info">修改</button>
      </span> <span>
      <button  style="margin-left:40px" class="btn btn-default" >删除 </button>
      </span> 
      </div>
    <div id="info" class="collapse" role="form">
      <form class="form-horizontal" style="width:700px">
        <div class="form-group">
          <label class="control-label col-sm-2" for="name">权限名称：</label>
          <div class="col-sm-10">
            <input type="text" class="form-control" id="name" value="权限一" />
          </div>
        </div>
        <div class="form-group">
          <label class="control-label col-sm-2" for="province">允许访问页面：</label>
          <div class="col-sm-10">
            <label class="checkbox-inline">
		<input type="checkbox" id="inlineCheckbox1" value="option1"> 页面 1
	</label>
	<label class="checkbox-inline">
		<input type="checkbox" id="inlineCheckbox2" value="option2"> 页面 2
	</label>
	<label class="checkbox-inline">
		<input type="checkbox" id="inlineCheckbox3" value="option3"> 页面 3
	</label>
          </div>
           <div class="col-sm-10">
            <label class="checkbox-inline">
		<input type="checkbox" id="inlineCheckbox1" value="option1"> 页面 4
	</label>
	<label class="checkbox-inline">
		<input type="checkbox" id="inlineCheckbox2" value="option2"> 页面 5
	</label>
	<label class="checkbox-inline">
		<input type="checkbox" id="inlineCheckbox3" value="option3"> 页面 6
	</label>
          </div>
        </div>
        <div class="form-group" style="margin:0 auto;display:block; width:100px">
        <button  class="btn btn-default"  id="ok">保存</button>
        </div>
      </form>
    </div>
  </div>
</div>
</body>
<script>
//页面加载
$().ready(function()
{
	//获取当前用户的信息
	var user_id=$.cookie("user_id");
	var password=$.cookie("password");
	$.post("/ulms_project/authority/queryAllAuthority",{user_id:user_id,password:password},function(data)
	{
		var str="";
		$(data).each(function()
		{
			str+='<div class="item">'+
   '<div><span style="margin-left:20px">'+this.name+'</span> <span>'+
      '<button id="modify" style="margin-left:40px" class="btn btn-default"  data-toggle="collapse" '+
    'data-target="#info_'+this.id+'">修改</button>'+
      '</span> <span>'+
      '<button  style="margin-left:40px" class="btn btn-default" >删除 </button>'+
      '</span> '+
      '</div>'+
    '<div id="info" class="collapse" role="form">'+
      '<form class="form-horizontal" style="width:700px">'+
        '<div class="form-group">'+
          '<label class="control-label col-sm-2" for="name">权限名称：</label>'+
          '<div class="col-sm-10">'+
            '<input type="text" class="form-control" id="name_'+this.id+'" value="'+this.name+'" />'+
          '</div>'+
        '</div>'+findPage(authority_id)+
        '<div class="form-group" style="margin:0 auto;display:block; width:100px">'+
        '<button  class="btn btn-default"  authority_id="'+this.authority_id+'" onclick="modify()">保存</button>'+
        '</div>'+
      '</form>'+
    '</div>'+
  '</div>';
		});
	});
});

//根据权限id查找可以访问的页面
function findPage(authority)
{
	var str="";
	$.post("/ulms_project/dict/",{authority:authority},function(data)
	{
		var pageList =data.list();
		str+='<div class="form-group">'+
          '<label class="control-label col-sm-2" for="province">允许访问页面：</label>';
		for(var i=0;i<length/8;++i)
		{
			str+='<div class="col-sm-10">';
			for(var j=0;j<8;++j)
			{
				if(pageList[i*8+j].checked==true)
				{
					str+='<label class="checkbox-inline">'+
		'<input type="checkbox" id="inlineCheckbox1" checked value="option1">'+pageList[i*8+j].name+'</label>';
				}
				else
				{
					str+='<label class="checkbox-inline">'+
		'<input type="checkbox" id="inlineCheckbox1"  value="option1">'+pageList[i*8+j].name+'</label>';
				}
			}
			str+='</div>';
		}
		str+= '</div>';
		return str;
	});
}
//查询功能
function query()
{
	var authority_id=$("#myInput").val();
	$.post("/ulms_project/authority/queryAllAuthority",{authority_id:authority_id},function(data)
	{
		str+='<div class="item">'+
   '<div><span style="margin-left:20px">'+this.name+'</span> <span>'+
      '<button id="modify" style="margin-left:40px" class="btn btn-default"  data-toggle="collapse" '+
    'data-target="#info_'+this.id+'">修改</button>'+
      '</span> <span>'+
      '<button  style="margin-left:40px" class="btn btn-default" >删除 </button>'+
      '</span> '+
      '</div>'+
    '<div id="info" class="collapse" role="form">'+
      '<form class="form-horizontal" style="width:700px">'+
        '<div class="form-group">'+
          '<label class="control-label col-sm-2" for="name">权限名称：</label>'+
          '<div class="col-sm-10">'+
            '<input type="text" class="form-control" id="name_'+this.id+'" value="'+this.name+'" />'+
          '</div>'+
        '</div>'+findPage(authority_id)+
        '<div class="form-group" style="margin:0 auto;display:block; width:100px">'+
        '<button  class="btn btn-default"  authority_id="'+this.authority_id+'" onclick="modify()">保存</button>'+
        '</div>'+
      '</form>'+
    '</div>'+
  '</div>';
	});
	
}
//添加权限功能
function addRight()
{
	window.open("addRight.html");
}
//该方法与上方法一样，由于某些原因先留下
function addAuthority()
{
	window.open("addRight.html");
}

//修改功能
function modify()
{
	//获取id
	var authority_id=$(this).attr("authority_id");
	//获取选择的权限
	var chk_value =[];//定义一个数组  
     $('input:checkbox:checked').each(function(){//遍历每一个名字为interest的复选框，其中选中的执行函数  
      chk_value.push($(this).val());//将选中的值添加到数组chk_value中  
     });
	 $.post("/ulms_project/authority/updateAuthority",{authority_id:authority_id,chk_value:chk_value},function(data)
	 {
		 alert("修改成功！");
	 });
}

//删除功能
function remove()
{
	//获取id
	var authority_id=$(this).attr("authority_id");
	$.post("/ulms_project/authority/deleteAuthority",{authority_id:authority_id},function(data)
	{
		alert("删除权限成功！");
	});
}

</script>
</html>
